
import scss from "../../assets/styles/header.module.scss"


/**
 * 头部组---主组件
 */
export const Header = (
    { children }
) => {
    return (
        <div className={scss['dt-header']}>
            {children}
        </div>
    )
}
/**
 * 头部栏--标题组件
 * @param {* title} 标题内容 
 * @returns 
 */
export const HTitle = (
    { title }
) => {
    return (
        <div className={scss['dt-header-title']}>
            <span>{title}</span>
            <div></div>
        </div>
    )
}

/**
 * 头部栏--右边菜单
 * @param {*menu} param0 
 * @returns 
 */
export const HMenu = (
    { Menu, onClick }
) => {
    return (
        <div className={scss['dt-header-menu']}>
            {
                Menu.map((item, num) => {
                    return (
                        <div
                            className={
                                scss['dt-header-menu-item'] +
                                ' ' +
                                scss[`${item.status && 'menu-item-sec'}`]
                            }
                            onClick={() => onClick(num)}
                        >{item.name}</div>
                    )
                })
            }
        </div>
    )
}